<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>show_student</title>
<!-- 引入easyui 的主题样式  和  easyui 提供的图标样式 -->
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/themes/bootstrap/easyui.css" />
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/themes/icon.css" />
<!-- 引入jquery 和  easyui.js   中文设置js-->
<script type="text/javascript"
	src="${pageContext.request.contextPath}\js\jquery-1.9.1.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/easyui-lang-zh_CN.js"></script>
</head>
<script type="text/javascript">
	$(function() {
		//加入学生选课
		$('#stu1').datagrid({ //以表格的形式展现数据
			title:'所有选课学生信息',
			url : 'insertstuall', //获取到表数据的路径
			fitColumns : true,
			columns : [ [ //列对象
			{
				field : 'ck',
				width : 100,
				checkbox : true
			}, {
				field : 'sid',
				width : 100
			}, {
				field : 'sname',
				width : 100
			}, {
				field : 'sage',
				width : 100
			}, {
				field : 'ssex',
				width : 100
			}, {
				field : 'sdepart',
				width : 100
			}, {
				field : 'stel',
				width : 100
			}, ] ],
			rownumbers : true, //显示行列号
		});

		$('#stu').datagrid({ //以表格的形式展现数据
			title:'选课学生信息',
			url : 'studentInfo', //获取到老师表数据的路径
			fitColumns : true,
			columns : [ [ //列对象
			{
				field : 'ck',
				width : 100,
				checkbox : true
			}, {
				field : 'sid',
				title : '学号',
				width : 100
			}, {
				field : 'sname',
				title : '姓名',
				width : 100
			}, {
				field : 'sage',
				title : '年龄',
				width : 100
			}, {
				field : 'ssex',
				title : '性别',
				width : 100
			}, {
				field : 'sdepart',
				title : '院系',
				width : 100
			}, {
				field : 'stel',
				title : '电话',
				width : 100
			}, ] ],
			rownumbers : true, //显示行列号
			pagePosition : 'bottom', //定义分页栏工具的位置
			pagination : true, //datagrid控件的底部显示分页控件
			pageSize : 3, //  初始化面页大小为5
			pageList : [ 3, 6, 9 ], //  初始化面页大小选择列表

			toolbar : [ {
				iconCls : 'icon-add',
				text : '增加所有选课学生',
				handler : function() {
					$('#insertwin').window('open');
				}
			}, '-', {
				iconCls : 'icon-remove',
				text : '删除对外选课学生',
				handler : function() {
					var row = $('#stu1').datagrid('getSelections');
					if (row.length == 1) {
						$("#deletestudentwin").window('open');
					} else {
						$.messager.confirm('信息', '请选择删除信息', function(r) {
						});
					}
				}
			} ]
		});
		//增加窗口
		$('#insertwin').window({
			width : 400,
			height : 200,
			modal : true,
			title : "增加",
			collapsible : false,
			minimizable : false,
			maximizable : false,
			closable : false,
			closed : true
		});

		//增加确定按钮
		$('#insertyes').linkbutton({
			onClick : function() {
				$("#stu1").datagrid('reload');
				$("#insertwin").window('close');
				$("#stu1Open").window('open');
			}
		});

		//增加取消按钮
		$('#insertno').linkbutton({
			onClick : function() {
				$('#insertwin').window("close");
			}
		});

		//删除窗口
		$('#deletestudentwin').window({
			width : 400,
			height : 200,
			modal : true,
			title : "删除",
			collapsible : false,
			minimizable : false,
			maximizable : false,
			closable : false,
			closed : true
		});
		//删除确定按钮
		$('#deletestudentyes').linkbutton({
			onClick : function() {
				var i = $('#stu1').datagrid('getChecked');
				var sid = i[0].sid;
				$('#stu1').datagrid({ 
					rowStyler: function(index,row){
						if (row.sid==sid){ 
							return 'display:none'; 
							}
						} 
				});
				$.messager.show({
					title : '信息提示',
					msg : '删除成功',
					timeout : 1000,
					showType : 'slide'
				});
				$("#deletestudentwin").window('close');
			}
		});

		//删除取消按钮
		$('#deletestudentno').linkbutton({
			onClick : function() {
				$('#deletestudentwin').window("close");
			}
		});
	})
</script>
<body>
	<!-- 学生表 -->
	<table id="stu"></table>
	<!-- 增加学生选课表 -->
	<div closed="true" class="easyui-panel" id="stu1Open">
		<table id="stu1"></table>
	</div>
	<!-- 增加文本框 -->
	<div id="insertwin" class="easyui-dialog"
		style="width: 400px; height: 280px; padding: 10px 20px;" closed="true"
		buttons="#dlg-buttons"><br>
		<div class="fitem">
			<label style="font-size: 15px;font-family:'微软雅黑'"> 是否查看选择其他课题的学生？ </label>
		</div>
		<br>
		<br>
		<div style="text-align: center;">
			<a id="insertyes" href="#" class="easyui-linkbutton"
				data-options="iconCls:'icon-ok'">是</a> &nbsp;&nbsp; &nbsp; &nbsp;
			&nbsp; <a id="insertno" href="#" class="easyui-linkbutton"
				data-options="iconCls:'icon-no'">否</a>
		</div>
	</div>

	<!-- 删除学生窗口 -->
	<div id="deletestudentwin">
		<div style="text-align: center; margin-top: 50px;">
			<span>是否删除该学生</span><br> <br> <br> <a
				id="deletestudentyes" href="#" class="easyui-linkbutton"
				data-options="iconCls:'icon-ok'">确定</a> &nbsp;&nbsp; &nbsp; &nbsp;
			&nbsp; <a id="deletestudentno" href="#" class="easyui-linkbutton"
				data-options="iconCls:'icon-no'">取消</a>
		</div>
	</div>
</body>
</html>